﻿function Group_Index() {
    //组model
    var groupModel = Ext.define("GroupModel", {
        extend: "Ext.data.Model",
        fields: [{
            name: "id",
            type: "int"
        }, {
            name: "groupName",
            type: "string"
        }, {
            name: "description",
            type: "string"
        }, {
            name: "createTime",
            type: "date"
        }, {
            name: "state",
            type: "string"
        }]
    });

    var groupStore = Ext.create("Ext.data.Store", {
        model: "GroupModel",
        pageSize: 16,
        remoteSort: true,
        proxy: {
            type: "ajax",
            url: 'Admin/Group/GetList',
            actionMethods: { read: 'POST' }, //将提交方式改为post
            waitMsg: '数据加载中...',
            reader: {
                type: "json",
                root: 'data',
                totalProperty: 'totalCount'//后台返回的记录总数,写在reader配置里
            }
        },
        params: {
            pageIndex: 0,
            pageSize: 14
        },
        autoLoad: true,
        sorters: [{
            property: "id",
            direction: "DESC"
        }]
    });

    // 角色状态Combo Store
    var stateStore = Ext.create("Ext.data.Store", {
        type: "json",
        proxy: {
            type: "ajax",
            url: 'Admin/Group/GroupState'
        },
        fields: ['Key', 'Value']
    });

    stateStore.load({
        callback: function () {
            //加载
            JsHelper.ExtTabDoLayout(main);
        }
    });

    var groupFormReader = Ext.create("Ext.data.JsonReader", {
        model: "GroupModel"
    });

    var showGroupWindowFn = function (formReader, title, id) {

        // 定义变量 是否更新操作标记 更新：true 添加：false
        var updateEdit = Ext.isDefined(id);
        // 定义表单验证成功后的提交参数及返回处理
        var formSubmitArgs = {
            url: !updateEdit ? "Admin/Group/AddGroup" : "Admin/Group/EditGroup",
            params: {
                "id": updateEdit ? id : ""
            },
            success: function (formObj, action) {
                winForGroup.destroy(); // 关闭窗口
                //刷新store 以更新页面数据
                groupStore.load();
            },
            failure: function (formObj, action) {
                JsHelper.ShowError(action.result.msg);
            }
        };

        // 定义获得表单初始加载数据的请求参数
        var formLoadArgs = (updateEdit) ? {
            url: 'Admin/Group/GetGroup',
            params: {
                'id': id
            },
            actionMethods: { read: 'POST' }, //将提交方式改为post
            waitMsg: '数据加载中...'
        } : null;

        var groupFormColumn = [{
            fieldLabel: '<span style="color: red;" >*</span>组名称',
            allowBlank: false,
            name: 'groupName'
        }, {
            fieldLabel: '<span style="color: red;" >*</span>组状态',
            allowBlank: false,
            xtype: 'combo',
            emptyText: '请选择状态',
            forceSelection: true, //不允许输入
            name: 'state',
            store: stateStore,
            displayField: 'Key',
            valueField: 'Value'
        }, {
            fieldLabel: '简短描述',
            name: 'description',
            xtype: "textareafield",
            grow: true,
            //height: 10,
            width: 430
        }];

        var groupForm = Ext.create("Ext.form.Panel", {
            border: false,
            waitMsgTarget: true,
            bodyStyle: 'padding:10px;',
            defaultType: 'textfield',
            reader: formReader,
            defaults: {
                labelWidth: 90,
                labelAlign: 'right',
                width: 250
            },
            layout: {
                columns: 1,
                type: 'table',
                tableAttrs: {
                    style: {
                        width: '100%'
                    }
                }
            },
            buttonAlign: 'center',
            buttons: [{
                text: '提交',
                cls: "x-button-center",
                icon: "Content/icons/accept.png",
                handler: function () {
                    if (groupForm.getForm().isValid()) {
                        groupForm.getForm().submit(formSubmitArgs); // formSubmitArgs
                        // 引用之前定义的请求参数变量
                    }
                }
            }, {
                text: '取消',
                cls: "x-button-center",
                icon: "Content/icons/cancel_new.png",
                handler: function () {
                    winForGroup.destroy();
                }
            }],
            items: groupFormColumn
        });

        var winForGroup = Ext.create("Ext.window.Window", {
            title: title,
            iconCls: 'application_form',
            resizable: false,
            autoHeight: true,
            modal: true,
            bodyStyle: 'background:#ffffff;padding-bottom:8px',
            items: [groupForm]
        });

        winForGroup.show();
        // 判断是否为表单加载初始数据
        if (formLoadArgs) {
            groupForm.load(formLoadArgs); // formLoadArgs 引用之前定义表单数据加载的请求参数变量
        };
    };

    var tobar = Ext.create("Ext.toolbar.Toolbar", {
        height: 30,
        items: [{
            text: '添加组',
            cls: "x-button-center",
            icon: "/Content/icons/add.png",
            handler: function () {
                showGroupWindowFn(groupFormReader, "添加菜单权限");
            }
        }, {
            text: '删除组',
            cls: "x-button-center",
            icon: "/Content/icons/delete.png",
            disabled: true,
            handler: function () {
                JsHelper.DelConfirm(function (btn) {
                    if (btn == 'yes') {
                        var model = groupGrid.getSelectionModel().getSelection()[0].data;
                        Ext.Ajax.request({
                            url: 'Admin/Group/DeleteGroup',
                            params: {
                                'id': model.id
                            },
                            success: function (response, opts) {
                                var result = Ext.JSON.decode(response.responseText);
                                if (result.success == false) {
                                    JsHelper.ShowError(result.msg);
                                }
                                else {
                                    groupStore.remove(model);
                                }
                            }
                        });
                    }
                });
            }

        }, {
            text: "双击编辑组",
            cls: "x-button-center",
            icon: "/Content/icons/pencil.png",
            disabled: true
        }]
    });

    var bbar = Ext.create("Ext.toolbar.Paging", {
        store: groupStore,
        displayInfo: false,
        displayMsg: '{0}到{1}条, 共{2}条',
        emptyMsg: "没有数据"
    });

    var sm = Ext.create("Ext.selection.CheckboxModel", {
        mode: "SINGLE",
        align: "center",
        allowDeselect: true,
        listeners: {
            "selectionchange": function (model, selected, eOpts) {
                tobar.items.getAt(1).setDisabled(false); //选中启用删除
                //设置右边的Tab页
                //...
            },
            "deselect": function (rowModel, record, index, eOpts) {
                menuPermissionStore.removeAll();
            }
        }
    });

    var groupGrid = Ext.create("PersistantSelectionGridPanel", {
        id: "groupGrid",
        store: groupStore,
        loadMask: true,
        autoScroll: true,
        stripeRows: true,
        selModel: sm,
        multiSelect: false,
        style: "margin-right:10px",
        region: "west",
        width: 270,
        columns: [{
            text: '名称',
            sortable: "true",
            flex: 2,
            dataIndex: "groupName"
        }, {
            text: '状态',
            flex: 1,
            renderer: function (value, metaData, record) {
                var v = "";
                var states = stateStore.data.items;
                Ext.Array.each(states, function (item) {
                    if (value == item.data.Value) {
                        v = item.data.Key;
                        return;
                    }
                });
                return v;
            },
            sortable: "true",
            dataIndex: "state"
        }],
        tbar: tobar,
        bbar: bbar,
        listeners: {
            "itemdblclick": function (cmp, record, it, index, e, eOpts) {
                var id = record.data.id;
                showGroupWindowFn(groupFormReader, "编辑用户组", id);
            }
        }
    });

    /**************************************************************************************/
    var menuPermission = Ext.define("menuModel", {
        extend: 'Ext.data.Model',
        fields: [{ name: 'id', type: 'int' },
                { name: 'actionName', type: 'string' },
                { name: 'controllerName', type: 'string' },
                { name: 'actionDescription', type: 'string' },
                { name: 'controllerDescription', type: 'string' },
                { name: 'prevIcon', type: 'string' },
                { name: 'menuName', type: 'string' },
                { name: 'parentId', type: 'int' },
                { name: 'leaf', type: 'bool' },
                { name: 'url', type: 'string' },
                { name: 'createTime', type: 'string' },
                { name: 'nodeLevel', type: 'int' }
            ]
    });

    var menuPermissionStore = Ext.create('Ext.data.TreeStore', {
        model: 'menuModel',
        proxy: {
            type: 'ajax',
            url: 'Admin/Menu/GetMenuGrid',
            actionMethods: { read: 'POST' }, //将提交方式改为post
            waitMsg: '数据加载中...',
            reader: {
                type: "json"
            }
        },

        nodeParam: "id",
        root: {
            menuName: "所有菜单",
            actionName: "",
            controllerName: "",
            id: -1,
            parentId: -1000,
            leaf: false,
            nodeLevel: 0,
            expanded: true
        },
        folderSort: true
    });

    var selChk = Ext.create("Ext.selection.CheckboxModel", {
        header: false,
        align: "center"
    });

    var menuPermissionGrid = Ext.create("Ext.tree.Panel", {
        id: "menuPermissionGrid",
        store: menuPermissionStore,
        multiSelect: true,
        selModel: selChk,
        singleExpand: false,
        layout: "fit",
        lines: false,
        stripeRows: true,
        useArrows: true,
        border: false,
        columns: [{
            xtype: "treecolumn", //这个列示树形的
            text: "菜单名称",
            dataIndex: "menuName",
            flex: 3.5
        }, {
            text: "动作名称",
            dataIndex: "actionName",
            flex: 2.5
        }, {
            text: "控制器名称",
            dataIndex: "controllerName",
            flex: 2.5
        }, {
            text: "动作描述",
            dataIndex: "actionDescription",
            flex: 4
        }, {
            text: "控制器描述",
            dataIndex: "controllerDescription",
            flex: 4
        }, {
            text: "图标",
            dataIndex: "prevIcon",
            flex: 2
        }, {
            text: "链接地址",
            dataIndex: "url",
            flex: 2
        }, {
            text: "是否叶子",
            dataIndex: "leaf",
            flex: 1.5,
            renderer: function (value) {
                if (value == null)
                    return "";
                return value ? "是" : "否";
            }
        }]
    });

    var actionPermissionGrid = { border: false };

    var permissionTab = Ext.create("Ext.tab.Panel", {
        region: "center",
        activeTab: 0,
        items: [{
            id: 'MenuPermissionPanel',
            title: '菜单权限',
            layout: 'fit',
            items: [menuPermissionGrid]
        }, {
            id: 'ActionPermissionPanel',
            title: '功能权限',
            layout: 'fit',
            items: [actionPermissionGrid]
        }]
    });


    /**************************************************************************************/

    // 创建框架
    var main = Ext.create("Ext.panel.Panel", {
        border: false,
        layout: 'border',
        bodyStyle: "background-color:#fff !important",
        items: [groupGrid, permissionTab]
    });

}
Group_Index();